<div>
  演示一下 动态组件。<br>
  值演示：{{value}}<br>
  
  一、元素HTML：
  <component is="input" placeholder="原生HTML" value='123'></component>
  <component is="div">这是div</component>
  
  <br><br>
  二、UI库：<component is="el-input"  placeholder="UI库的文本框" style="width: 200px;" v-model='value'></component><br><br>
  三、局部注册的组件：<component is="test" str="局部注册的组件" ></component><br><br>
  四、异步组件：
  <component 
    :is="defineAsyncComponent(()=>import('http://localhost:8102/src/components/test.js?v=1'))"
    str="局部注册的组件"
  ></component><br>
  <hr>
  v-for的方式：<br>
  <template v-for="key in [101, 102, 103, 104]" :key="key">
    <component 
      :is="dict[key]"
    ></component>
  </template>
  <el-input size="mini"></el-input>
</div>
    